<template>
  <div class="printpanel clearfix" :style="styleObject">
    <div class="printpanel_n">
      <div class="img">
        <qrcode-vue :value="state.barCodeText" :size="100" level="H" />
      </div>
      <div class="neirong">
        <p v-if="false">存货编码：{{state.kcObj.cinvcode}}</p>
        <p>存货名称：{{state.kcObj.cinvname}}</p>
        <p>规格型号：{{state.kcObj.cinvstd}}</p>
        <p>存货单位：{{state.kcObj.ccomunitname}}</p>
      </div>
      <div style="clear: both"></div>
    </div>
  </div>
</template>

<script setup name="printItemIndex">
import request from '/@/utils/request';
import { ElMessage } from 'element-plus';
import {storeToRefs} from "pinia/dist/pinia";
import { useProConfig } from '/@/stores/proConfig';
import {reactive, ref, onMounted, onUnmounted, defineProps, defineEmits, nextTick, defineAsyncComponent} from "vue";
//导入二维码组件
import QrcodeVue from 'qrcode.vue';

const proConfig= useProConfig();
const { config } = storeToRefs(proConfig);
const {barcodebaseurl} = config.value;

const props = defineProps({
  autoid: {
    type: Number,
    default: 0,
  },
  inx:{ //排序号
    type : Number,
    default : 0
  }
});
const styleObject = reactive({
  height: '150px',
  marginTop:'0px'
})
const state = reactive({
  barCodeText : '',
  kcObj : {},
})
const getKcData = ()=>{
  request({
    url: '/currentstore/getcurrentstore',
    data: {id : props.autoid}
  }).then(res => {
    const { data } = res
    state.kcObj = data;
  })
}
onMounted(()=>{
  if(props.inx % 12 === 0 || props.inx % 12 === 1 ){
    styleObject.marginTop = '59px'
  }
  nextTick(()=>{
    state.barCodeText = barcodebaseurl + "?kcid=" + props.autoid
    getKcData();
  })
})
</script>

<style scoped lang="scss">
.printpanel{
  box-sizing: border-box;
  width: 340px;
  height: 150px;
  overflow-y: hidden;
  .printpanel_n{
    width: 78%;
    height: 150px;
    padding-left: 5px;
    border: 1px dashed #0048ff;
    .img{
      float: left;
      width: 100px;
      height: 100px;
      padding-top: 20px;
    }
    .neirong{
      float: left;
      width: 158px;
      padding-left: 5px;
      padding-top: 20px;
      font-size: 12px;
      font-weight:bold;
      p{
        color: #000000;
        padding-top: 3px;
      }
    }
  }

}
</style>
